<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="page_right" style="position:relative;">
    <dl class="placeAndEquipment_dl">
        <dt>场地名：</dt>
        <dd><input type="text" id="placeName" placeholder="请输入场地名"></dd>
        <dt>设备名：</dt>
        <dd><input type="text" id="deviceName" placeholder="请输入设备名"></dd>
        <dt>设备简码：</dt>
        <dd><input type="text" id="deviceShortCode" placeholder="请输入设备简码"></dd>
        <dt>IMEI/MAC码：</dt>
        <dd><input type="text" id="mac" placeholder="请输入IMEI/MAC码"></dd>
        <dd><a class="placeAndEquipment_search" href="javascript:;">查询</a></dd>
    </dl>
    <div style="background:#f7f7f7; padding:10px 0 20px 0;">
        <ul class="placeAndEquipment_ul">
            <li>
                <a class="${cur==1?"cur":""}" name="0" href="javascript:;"><p>在线</p><p>${online.size()}</p></a>
            </li>
            <li>
                <a name="1" href="javascript:;"><p>离线</p><p>${offline.size()}</p></a>
            </li>
            <li>
                <a name="2" href="javascript:;"><p>禁用</p><p>${disabled.size()}</p></a>
            </li>
            <li>
                <a name="3" href="javascript:;"><p>故障</p><p>${fault.size()}</p></a>
            </li>
        </ul>
    </div>

    <div>
        <ul class="placeAndEquipment_title">
            <li>序号</li>
            <li>场地名称</li>
            <li>设备名称</li>
            <li>设备简码</li>
            <li>设备类型</li>
            <li>信号强度</li>
            <li>操作</li>
        </ul>
        <div class="placeAndEquipment_listdv" style="height:500px;">
            <c:forEach items="${online}" var="data" varStatus="status">
                <ul class="placeAndEquipment_list">
                    <li>${status.count}</li>
                    <li>${data.address}</li>
                    <li>${data.deviceName}</li>
                    <li>${data.deviceShortCode}</li>
                    <li>${data.dtName}</li>
                    <li>
                <c:choose>
                    <c:when test="${data.dp<2}">
                        <img src="${basePath}resources/images/web/v2/equipment/wuxinhao.png" alt="">
                    </c:when>
                    <c:when test="${data.dp<=7}">
                        <img src="${basePath}resources/images/web/v2/equipment/xinhaoruo.png" alt="">
                    </c:when>
                    <c:when test="${data.dp<=14}">
                        <img src="${basePath}resources/images/web/v2/equipment/xinhaozhong2.png" alt="">
                    </c:when>
                    <c:when test="${data.dp<=23}">
                        <img src="${basePath}resources/images/web/v2/equipment/xinhaozhong.png" alt="">
                    </c:when>
                    <c:otherwise>
                        <img src="${basePath}resources/images/web/v2/equipment/xinhaoqiang.png" alt="">
                    </c:otherwise>
                </c:choose>
                    </li>
                    <li><a href="${basePath}v3/device/${data.placeId}/placeView/${data.deviceId}/0/deviceView">编辑</a></li>
                </ul>
            </c:forEach>
        </div>
    </div>
    <div class="placeAndEquipment_page" style="margin-top:20px; ${online.size()>0?"":"display:none"}"><div class="page_dv"></div></div>
</div>
<script type="text/javascript">
    $(".placeAndEquipment_search").click(function(){
        var placeName = $("#placeName").val();
        var deviceName = $("#deviceName").val();
        var deviceShortCode = $("#deviceShortCode").val();
        var mac = $("#mac").val();
        var indexTemp = $(".placeAndEquipment_ul a.cur").attr("name");
        $.ajax({
            url: "${basePath}v3/place/showDeviceList",
            type: 'POST',
            data: {"placeName":placeName,"deviceName":deviceName,"deviceshortcode":deviceShortCode,"imme":mac,"index":indexTemp,"page":1},
            error: function (response) {
                $errorMsg(response);
            },
            success: function (ret) {
                if(ret.result==true){
                    if(ret.scrollResult.total>0){
                        doDeviceList(ret.scrollResult,indexTemp);
                        $(".placeAndEquipment_page").css("display","");
                        temp = Math.ceil(ret.scrollResult.rows.size()/10);
                        $(".page_dv").empty();
                        doPaging();
                    }else{
                        $(".placeAndEquipment_listdv").empty();
                        $(".placeAndEquipment_page").css("display","none");
                    }
                }else{
                    alert(ret.info);
                }
            }
        });
    });

    $(".placeAndEquipment_ul a").each(function(indexTemp){
        $(this).click(function(){
            var placeName = $("#placeName").val();
            var deviceName = $("#deviceName").val();
            var deviceShortCode = $("#deviceShortCode").val();
            var mac = $("#mac").val();
            var total = $(this).children("p:eq(1)").text();
            $(".placeAndEquipment_ul a").removeClass("cur");
            $(this).addClass("cur");
            $.ajax({
                url: "${basePath}v3/place/showDeviceList",
                type: 'POST',
                data: {"placeName":placeName,"deviceName":deviceName,"deviceshortcode":deviceShortCode,"imme":mac,"index":indexTemp,"page":1},
                error: function (response) {
                    $errorMsg(response);
                },
                success: function (ret) {
                    if(ret.result==true){
                        if(total>0){
                            doDeviceList(ret.scrollResult,indexTemp);
                            $(".page_dv").empty();
                            $(".placeAndEquipment_page").css("display","");
                            temp = Math.ceil(total/10);
                            doPaging();
                        }else{
                            $(".placeAndEquipment_listdv").empty();
                            $(".placeAndEquipment_page").css("display","none");
                        }
                    }else{
                        alert(ret.info);
                    }
                }
            });
        });
    });

    var total = '${online.size()}';
    var temp=Math.ceil(total/10);
    function doPaging(){
        $(".placeAndEquipment_page").paging({
            "container":".placeAndEquipment_page",
            "indexmax":temp,
            "indexcur":1,
            "flag":true,
            "clickevent":function(flag, indexcur){
                var placeName = $("#placeName").val();
                var deviceName = $("#deviceName").val();
                var deviceShortCode = $("#deviceShortCode").val();
                var mac = $("#mac").val();
                var indexTemp = $(".placeAndEquipment_ul a.cur").attr("name");
                if(flag){
                    $.ajax({
                        url: "${basePath}v3/place/showDeviceList",
                        type: 'POST',
                        data: {"placeName":placeName,"deviceName":deviceName,"deviceshortcode":deviceShortCode,"imme":mac,"index":indexTemp,"page":indexcur},
                        error: function (response) {
                            $errorMsg(response);
                        },
                        success: function (ret) {
                            if(ret.result==true){
                                if(ret.scrollResult.total>0){
                                    doDeviceList(ret.scrollResult,indexTemp);
                                }else{
                                    $(".placeAndEquipment_listdv").empty();
                                    $(".placeAndEquipment_page").css("display","none");
                                }
                            }else{
                                alert(ret.info);
                            }
                        }
                    });
                }
            },
        });
    }
    doPaging();

    function doDeviceList(objVal,cur) {
        if(objVal.total>0){
            $(".placeAndEquipment_listdv").empty();
            for(var index in objVal.rows){
                var equipment_allLi="";
                for(var j=0; j<7; j++) {
                    if (j == 0) {
                        equipment_allLi += "<li>" + eval(index+"+"+1)+ "</li>";
                    } else if (j == 1) {
                        equipment_allLi += "<li>" + objVal.rows[index]["address"] + "</li>";
                    } else if (j == 2) {
                        equipment_allLi += "<li>" + objVal.rows[index]["deviceName"] + "</li>";
                    } else if (j == 3) {
                        equipment_allLi += "<li>" + objVal.rows[index]["deviceShortCode"] + "</li>";
                    } else if (j == 4) {
                        equipment_allLi += "<li>" + objVal.rows[index]["dtName"] + "</li>";
                    } else if (j == 5) {
                        if (objVal.rows[index]["dp"] < 2) {
                            equipment_allLi += "<li><img src='${basePath}resources/images/web/v2/equipment/wuxinhao.png' alt=''></li>";
                        }else if (objVal.rows[index]["dp"] <= 7) {
                            equipment_allLi += "<li><img src='${basePath}resources/images/web/v2/equipment/xinhaoruo.png' alt=''></li>";
                        }else if (objVal.rows[index]["dp"] <= 14) {
                            equipment_allLi += "<li><img src='${basePath}resources/images/web/v2/equipment/xinhaozhong2.png' alt=''></li>";
                        } else if (objVal.rows[index]["dp"] <= 23) {
                            equipment_allLi += "<li><img src='${basePath}resources/images/web/v2/equipment/xinhaozhong.png' alt=''></li>";
                        } else {
                            equipment_allLi += "<li><img src='${basePath}resources/images/web/v2/equipment/xinhaoqiang.png' alt=''></li>";
                        }
                    } else if (j == 6) {
                        equipment_allLi += "<li><a href='${basePath}v3/device/"+objVal.rows[index]["placeId"]+"/placeView/"+objVal.rows[index]["deviceId"]+"/"+cur+"/deviceView'>编辑</a></li>";
                    }
                }
                $(".placeAndEquipment_listdv").append("<ul class='placeAndEquipment_list'>"+equipment_allLi+"</ul>");
            }
        }
    }

</script>

